{% extends 'layouts/base.html' %}

{% block title %}{{ title }}{% endblock title %}

<!-- Specific CSS goes HERE -->
{% block stylesheets %}{% endblock stylesheets %}

{% block content %}

    <div class="container-fluid py-4">
        <div class="row">
            <div class="col-lg-4 mb-lg-0 mb-4">
                <div class="card h-100">
                    <div class="card-header pb-0">
                        <div class="row">
                            <div class="col-lg-6 col-7">
                                <h4 class="p-2">{{ page_name }}</h4>
                            </div>
                            <div class="col-lg-6 col-5 my-auto text-end">
                                <div class="dropdown float-lg-end pe-4">
                                    <a class="cursor-pointer" id="dropdownTable" data-bs-toggle="dropdown"
                                       aria-expanded="false">
                                        <i class="fa fa-ellipsis-v text-secondary"></i>
                                    </a>
                                    <ul class="dropdown-menu px-2 py-3 ms-sm-n4 ms-n5" aria-labelledby="dropdownTable">
                                        <li><a class="dropdown-item border-radius-md"
                                               href="{% url 'instance_detail' result.instance.id %}">返回实例详情</a>
                                        </li>
                                        <li><a class="dropdown-item border-radius-md"
                                               href="{% url 'result_list' %}">返回结果列表</a></li>
                                        <li><a class="dropdown-item border-radius-md" href="javascript:;">Something else
                                            here</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card-body p-3">
                        <div class="table-responsive">
                            <table class="table align-items-center mb-0">
                                <tbody class="p-3">
                                <tr>
                                    <td>
                                        <i class="fas fa-code text-sm ms-1" aria-hidden="true"></i>&nbsp;
                                        <span class="font-weight-bold">编号</span>
                                    </td>
                                    <td>{{ result.id }}</td>
                                </tr>
                                <tr class="p-3">
                                    <td>
                                        <i class="fas fa-newspaper text-sm ms-1" aria-hidden="true"></i>&nbsp;
                                        <span class="font-weight-bold">实例名称</span>
                                    </td>
                                    <td>
                                        <a href="{% url 'instance_detail' result.instance.id %}">
                                            {{ result.instance.name }}
                                        </a>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <i class="fas fa-file-signature text-sm ms-1" aria-hidden="true"></i>&nbsp;
                                        <span class="font-weight-bold">模型名称</span>
                                    </td>
                                    <td>
                                        <a href="{% url 'model_detail' result.instance.model.id %}">
                                            {{ result.instance.model.name }}
                                        </a>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <i class="fas fa-calendar text-sm ms-1" aria-hidden="true"></i>&nbsp;
                                        <span class="font-weight-bold">生成时间</span>
                                    </td>
                                    <td>{{ result.create_datetime }}</td>
                                </tr>
                                <tr>
                                    <td>
                                        <i class="fas fa-user text-sm ms-1" aria-hidden="true"></i>&nbsp;
                                        <span class="font-weight-bold">拥有者</span>
                                    </td>
                                    <td>{{ result.instance.of_project.owner }}</td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}